<template>
	<view class="root_box">
	    <!-- 成功图标 -->
	    <view class="img_box">
	      <image src="/static/images/success.png" mode="aspectFit" />
	    </view>
	    
	    <!-- 成功文字 -->
	    <view class="success-text">
	      <text class="title">预约成功</text>
	      <text class="order-number">预约编号：3242525363634</text>
	    </view>
	
	    <!-- 操作按钮 -->
	    <view class="button-group">
	      <button class="btn primary" @click="goToHome">返回首页</button>
	    
	    </view>
	  </view>
</template>

<script setup>
const goToHome = () => {
  uni.switchTab({
    url: '/pages/index'
  })
}

// function detailsPage(){
// 	  uni.navigateTo({
// 	    url: '/pages/gmh/recor_detail/recor_detail'
// 	  });
// }
</script>

<style>
	.root_box {
	  width: 100vw;
	  height: 100vh;
	  background-color: #ffffff;
	  display: flex;
	  flex-direction: column;
	  align-items: center;
	  justify-content: center;
	}
	
	.img_box {
	  width: 200rpx;
	  height: 200rpx;
	  margin-bottom: 120rpx;
	  
	}
	
	.success-text {
	  text-align: center;
	  margin-bottom: 60rpx;
	}
	
	.title {
	  display: block;
	  font-size: 36rpx;
	  color: #333;
	  font-weight: 500;
	  margin-bottom: 20rpx;
	}
	
	.order-number {
	  font-size: 28rpx;
	  color: #999;
	}
	
	.button-group {
	  width: 80%;
	}
	
	.btn {
	  width: 100%;
	  height: 88rpx;
	  border-radius: 44rpx;
	  font-size: 32rpx;
	  margin-bottom: 30rpx;
	  transition: opacity 0.3s;
	}
	
	.btn:active {
	  opacity: 0.8;
	}
	
	.primary {
	  background: #007AFF;
	  color: #fff;
	}
	
	.secondary {
	  background: #F8F8F8;
	  color: #333;
	  border: 2rpx solid #EEEEEE;
	}
</style>
